<template>
  <div style="padding: 28px;">
    <div style="display: flex;justify-content: space-between;">
      <div
        style="width: 33%;height: 200px;background: #FFFFFF;padding: 20px 32px;"
      >
        <div style="font-size: 16px;color: #1D2129;">已向公众开放体育场馆</div>
        <div style="display: flex; margin-top: 30px;">
          <img
            src="@/assets/img/Frame@2x.png"
            alt=""
            style="width: 44px;height: 44px;"
          />
          <div style="margin-left: 16px;">
            <div style="font-size: 24px;font-weight: 400;color: #0F0F0F;">
              34,201
            </div>
            <div style="font-size: 11px;font-weight: 400;">总面积/平方米</div>
          </div>
        </div>
      </div>

      <div
        style="width: 33%;height: 200px;background: #FFFFFF;padding: 20px 32px;"
      >
        <div style="font-size: 16px;color: #1D2129;">
          已向公众开放体育场馆类型
        </div>

        <div style="display: flex;">
          <div
            style="height: 76px;background: #F7F8FA; margin-top: 16px; width: 50%;"
          >
            <div
              style="height: 76px; line-height:35px;border-left: 4px solid #4E88F5;"
            >
              <div style="margin-left:12px;">
                <div>每日开放</div>
                <div style="font-size: 24px;font-weight: 400;color: #0F0F0F;">
                  57000
                </div>
              </div>
            </div>
          </div>
          <div
            style="height: 76px;background: #F7F8FA; margin-top: 16px; width: 50%;"
          >
            <div
              style="height: 76px; line-height:35px;border-left: 4px solid #41B776;"
            >
              <div style="margin-left:12px;">
                <div>每日开放</div>
                <div style="font-size: 24px;font-weight: 400;color: #0F0F0F;">
                  57000
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        style="width: 33%;height: 200px;background: #FFFFFF;padding: 20px 32px;"
      >
        <div style="font-size: 16px;color: #1D2129;">
          开放场馆类型日均开放时间
        </div>

        <div style="display: flex;">
          <div
            style="height: 76px;background: #F7F8FA; margin-top: 16px; width: 50%;"
          >
            <div
              style="height: 76px; line-height:35px;border-left: 4px solid #4E88F5;"
            >
              <div style="margin-left:12px;">
                <div>每日开放平均时间/小时</div>
                <div style="font-size: 24px;font-weight: 400;color: #0F0F0F;">
                  5
                </div>
              </div>
            </div>
          </div>
          <div
            style="height: 76px;background: #F7F8FA; margin-top: 16px; width: 50%;"
          >
            <div
              style="height: 76px; line-height:35px;border-left: 4px solid #41B776;"
            >
              <div style="margin-left:12px;">
                <div>节假日平均开放时间/小时</div>
                <div style="font-size: 24px;font-weight: 400;color: #0F0F0F;">
                  7
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div style="margin-top: 16px;display: flex;justify-content: space-between;">
      <div style="width: 60%;height: 500px;background: #FFFFFF;">
        <FundInput></FundInput>
      </div>
      <div style="width: 39.6%;height: 500px;background: #FFFFFF;">
        <insurance></insurance>
      </div>
    </div>
  </div>
</template>

<script>
import FundInput from "./components/FundInput.vue";
import insurance from "./components/insurance.vue";

export default {
  components: {
    FundInput,
    insurance
  },
  data() {
    return {};
  },
  mounted() {},

  methods: {}
};
</script>

<style></style>
